$header-height: 60px;
$bottom-overlay-height: 60px;
$video-seekbar-height: 20px;
$video-seekbar-line-height: 3px;
$video-controls-height: $video-seekbar-height - $video-seekbar-line-height;
$video-player-gradient: linear-gradient(to bottom, rgba(0, 0, 0, 0.94), transparent);

$home-offset: 200px;

$main-width: 1400px;
$mobile-width: 700px;
$watch-break-width: 380px;

$header-font: 'expletus-bold', 'Open Sans', sans-serif;
$default-font: 'noto-sans', Arial, sans-serif;

$max-shadow:
  0 14px 28px rgba(0, 0, 0, 0.25),
  0 10px 10px rgba(0, 0, 0, 0.22);
$medium-shadow:
  0 3px 6px rgba(0, 0, 0, 0.16),
  0 3px 6px rgba(0, 0, 0, 0.23);
$low-shadow:
  0 1px 3px rgba(0, 0, 0, 0.12),
  0 1px 2px rgba(0, 0, 0, 0.24);

$intro-easing: cubic-bezier(0.31, 0.65, 0.26, 0.97);
$outro-easing: cubic-bezier(0.71, 0.21, 1, 0.46);
$dynamic-easing: cubic-bezier(0.76, 0.09, 0.3, 0.89);
$overshoot-easing: cubic-bezier(0.175, 0.885, 0.32, 1.275);

$alt-easing: cubic-bezier(0.08, 0.75, 0.31, 0.96);

$theme-color-gradient-vertical: linear-gradient(
  to top,
  var(--theme-color-light),
  var(--theme-color)
);
$theme-color-primary-gradient: linear-gradient(
  to right,
  var(--theme-color),
  var(--theme-color-dark)
);

$bgcolor-gradient: linear-gradient(to right, var(--bgcolor-alt), var(--bgcolor-alt-light));

$video-thmb-overlay-bgcolor: rgba(0, 0, 0, 0.714);
$video-thmb-overlay-textcolor: #fff;

$player-height: calc((9 / 16) * 100vw);
$player-max-height: calc(100vh - 169px);

$search-box-width: 800px;

$title-color-fake-gradient: linear-gradient(to right, var(--title-color), var(--title-color));
